<template>
  <div class="pag">
    <el-pagination background layout="total,prev, pager, next,jumper" :total="total"
    :page-size='pageSize' @current-change="changePage" :current-page.sync="Page" >
    </el-pagination>
  </div>
</template>

<script>
export default {
    data(){
        return{
           Page:this.currentPage
        }
    },
    props:{
        total:{
            type:Number,
            default:100
        },
        pageSize:{
            type:Number,
            default:10
        },
        currentPage:{
            type:Number,
            default:1
        }
    },
    methods:{
        changePage(page){
            this.$emit('changePage',page)
        }
    }
};
</script>

<style lang="less" scoped>
    .pag{
        text-align: center;
        margin-top:100px ;
        padding-bottom: 20px;
    }
</style>